{% extends 'base.html' %}
{% from 'bootstrap/form.html' import render_form %}

{% block content %}



   <div class="container-fluid">
	<div class="row">
		<div class="col-md-12">
			<div class="float-lg-none"><img src="https://i.ibb.co/s2mp4Qq/1.png" alt="1" border="0"></div>
            <div class="float-lg-none">
			<ul>
				<li class="list-item">
					姓名：伟业
				</li>
				<li class="list-item">
					年龄：20
				</li>
				<li class="list-item">
					联系方式：18306832083
				</li>
				<li class="list-item">
					座右铭：永远的学习者
				</li>
			</ul>
            </div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-12">
			<div class="page-header">
				<h4>
					<strong>我的技能</strong>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-3">
			<div class="card text-white bg-primary">
				<h5 class="card-header  bg-primary">
					程序语言<img src="https://i.ibb.co/jhns3rz/1.png" alt="1" border="0">
				</h5>
				<div class="card-body">
					<p class="card-text">
						熟悉Python基础语法体系，优美胜于丑陋，简洁胜于复杂
					</p>
				</div>

			</div>
		</div>
		<div class="col-md-3">
			<div class="card text-white bg-success">
				<h5 class="card-header bg-success">
					框架<img src="https://i.ibb.co/qpMgX21/flask.png" alt="flask" border="0">
				</h5>
				<div class="card-body">
					<p class="card-text">
						擅长Python-Flask 框架，MVC架构，包组织代码方式，前端bootstrap
					</p>
				</div>

			</div>
		</div>
		<div class="col-md-3">
			<div class="card text-white bg-info">
				<h5 class="card-header bg-info">
					爬虫与数据分析<img src="https://i.ibb.co/fxGLgNX/3.png" alt="3" border="0">
				</h5>
				<div class="card-body">
					<p class="card-text">
						经常使用requests库，BeautifulSoup库，并实现数据持久化

					</p>
				</div>

			</div>
		</div>
		<div class="col-md-3">
			<div class="card text-white bg-danger">
				<h5 class="card-header bg-danger">
					机器学习<img src="https://i.ibb.co/fdk07tv/2.png" alt="2" border="0">
				</h5>
				<div class="card-body">
					<p class="card-text">
						了解监督学习中的假设函数以及代价函数，解决线性回归问题
					</p>
				</div>

			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-12">
			<div class="page-header">
				<h4>
					<strong>我的展望</strong>
				</h4>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="col-md-4">
			<div class="card text-white bg-danger">
				<h5 class="card-header bg-danger">
					Execution
				</h5>
				<div class="card-body">
					<p class="card-text">
						Get things done
					</p>
				</div>

			</div>
		</div>
		<div class="col-md-4">
			<div class="card text-white bg-warning">
				<h5 class="card-header bg-warning">
					lifelong-learning
				</h5>
				<div class="card-body">
					<p class="card-text">
						Nothing last but last learn
					</p>
				</div>

			</div>
		</div>
		<div class="col-md-4">
			<div class="card text-white bg-primary">
				<h5 class="card-header bg-primary">
					Communication
				</h5>
				<div class="card-body">
					<p class="card-text">
						learn how to collaborate with others
					</p>
				</div>

			</div>
		</div>
         <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <div class="row">
		<div class="col-md-12">
			<div class="page-header">
				<h4>
					<strong>留下你的评论</strong>
				</h4>
			</div>
		</div>
	</div>
	</div>
</div>


<div class="list-group">
        {% for comment in comments %}
            <a class="list-group-item list-group-item-action flex-column">
                <div class="d-flex w-100 justify-content-between">
                    <h5 class="mb-1 text-success">{{ comment.author }}
                        <small class="text-muted"> #{{ loop.revindex }}</small>
                    </h5>
                    <small data-toggle="tooltip" data-placement="top"
                           data-timestamp="{{ comment.timestamp.strftime('%Y-%m-%dT%H:%M:%SZ') }}"
                           data-delay="500">
                            {{  comment.timestamp.strftime('%Y-%m-%dT%H:%M:%SZ') }}
                            {{ moment(comment.timestamp).fromNow(refresh=True) }}
                    </small>
                </div>
                <p class="mb-1">{{ comment.body }}</p>
            </a>
        {% endfor %}
 </div>

{% endblock %}




{% block comments %}

 <div class="hello-form">
        {{ render_form(form, action=request.full_path) }}
 </div>



{% endblock %}